// 导航栏js
// 产品介绍弹窗
let  popup = document.querySelector(".popup");
let popupBg = document.querySelector(".popupBg");

let popupLeft = document.querySelectorAll(".popupLeft div");
let popupRight = document.querySelectorAll(".popupRight div");

function mouseOver(x){
    x.style.display = 'block';
}
function mouseOut1(x) {
    x.style.display = 'none';
}
function mouseOut(x,y){
    x.style.display = 'none';
    for(let content of y){
        content.style.backgroundColor = '#fff';
        content.style.color= 'rgba(0, 0, 0, 0.7)' ;
    }
}
popupLeft.forEach((items ,index) =>{
    popupLeft[index].onmouseover = function (){
        for(let content of popupLeft){
            content.style.backgroundColor = '#fff';
            content.style.color= 'rgba(0, 0, 0, 0.7)' ;
        }
        for(let content of popupRight){
            content.style.display = 'none';
        }
        popupLeft[index].style.color= '#000' ;
        popupLeft[index].style.backgroundColor = '#f6f6f6';
        popupRight[index].style.display = 'block';
    }
})

//智能办公弹窗
let hotActPopup = document.querySelector(".hotActPopup");

hotActPopup.onmouseover = function (){
        hotActPopup.style.display = 'block';
}

//解决方案弹窗
let solutionPopup = document.querySelector(".solutionPopup");
let solutionPopupA = document.querySelectorAll(".solutionPopupA");

solutionPopupA.forEach((items,index) =>{
    solutionPopupA[index].onmouseover = function (){
        for(let content of solutionPopupA){
            content.style.backgroundColor = '#fff';
            content.style.color= 'rgba(0, 0, 0, 0.7)' ;
        }
        this.style.color = '#005EFF';
        this.style.backgroundColor = '#f6f6f6';
    }
})
/*支持与服务弹窗*/
let supportPopup = document.querySelector(".supportPopup");
let supportPopupA = document.querySelectorAll(".supportPopupA");


supportPopupA.forEach((items,index) =>{
    supportPopupA[index].onmouseover = function (){
        for(let content of supportPopupA){
            content.style.backgroundColor = '#fff';
            content.style.color= 'rgba(0, 0, 0, 0.7)' ;
        }
        items.style.color = '#005EFF';
        items.style.backgroundColor = '#f6f6f6';
    }
})
// 中文弹窗
let chinaPopup = document.querySelector(".chinaPopup");
let chinaPopupA = document.querySelectorAll(".chinaPopupA");

chinaPopupA.forEach( (items,index) =>{
    chinaPopupA[index].onmouseover = function (){
        for(let content of chinaPopupA){
            content.style.backgroundColor = '#fff';
            content.style.color= 'rgba(0, 0, 0, 0.7)' ;
        }
        items.style.color = '#005EFF';
        items.style.backgroundColor = '#f6f6f6';
    }
})


// 四个跳转滚动固定事件
let fourSkipBg = document.querySelector(".fourSkipBg");
let fourSkipBgH = fourSkipBg.offsetTop;
let fourSkipMenu = document.querySelector(".fourSkipMenu");
let fourSkipReg = document.querySelector(".fourSkipReg");
let menuPopupFixed = document.querySelector(".menuPopupFixed");
// let menuPopup = document.querySelector(".menuPopup");




document.onscroll = function (){
    //获取滚动条高度
    let onscrollH = document.documentElement.scrollTop || document.body.scrollTop;
    //四个跳转js
    let oneSkip = document.querySelector(".oneSkip");
    let oneSkipH = document.querySelector(".picOnlineBg").offsetTop;
    let twoSkip = document.querySelector(".twoSkip");
    let twoSkipH = document.querySelector(".useScene").offsetTop;
    let threeSkip = document.querySelector(".threeSkip");
    let threeSkipH = document.querySelector(".customerCase").offsetTop;
    let fourSkip = document.querySelector(".fourSkip");
    let fourSkipH = document.querySelector(".partner").offsetTop;
    let fourSkipCons = document.querySelectorAll(".fourSkipCon");

    //清楚底部边框的方法
    function clear(){
        for(let content of fourSkipCons){
            content.style.borderBottom = 'unset';
        }
    }
    //四个跳转跟着滚动
    if (onscrollH >= fourSkipBgH){
        fourSkipBg.style.position = 'fixed';
        fourSkipBg.style.top = '0px';
        fourSkipMenu.style.visibility = 'visible';
        fourSkipReg.style.visibility = 'visible';
        length()

    }else{
        fourSkipBg.style.position = 'static';
        fourSkipMenu.style.visibility = 'hidden';
        fourSkipReg.style.visibility = 'hidden';
        menuPopupFixed.style.display = 'none';
        clear();
    }
    //底部边框边蓝色样式
    fourSkipCons.forEach((items,index)=>{
        fourSkipCons[index].onclick = function (){
            length();
            console.log("ss");
        }
    });

    //底部边框变蓝色的判断方法
    function length(){
        if (onscrollH >= oneSkipH && onscrollH < twoSkipH){
            clear();
            oneSkip.style.borderBottom = '2px solid #3296FA';
        }else if (onscrollH >= twoSkipH && onscrollH < threeSkipH){
            clear();
            twoSkip.style.borderBottom = '2px solid #3296FA';
        }else if (onscrollH >= threeSkipH && onscrollH < fourSkipH){
            clear();
            threeSkip.style.borderBottom = '2px solid #3296FA';
        }else if (onscrollH >= fourSkipH){
            clear();
            fourSkip.style.borderBottom = '2px solid #3296FA';
        }
    }
}


//全部菜单图标换颜色
let fourSkipMenuIcon = document.querySelector(".fourSkipMenuIcon");

fourSkipMenu.onmouseover =function(){
    fourSkipMenuIcon.style.backgroundImage = "url('img/empHealth/imImg/menu2.png')";
    mouseOver(menuPopupFixed);
}
fourSkipMenu.onmouseout =function(){
    fourSkipMenuIcon.style.backgroundImage = "url('img/empHealth/imImg/menu1.png')";
    mouseOut1(menuPopupFixed);
}

// 全部菜单弹窗移入事件
menuPopupFixed.onmouseover = function (){
    menuPopupFixed.style.display = 'block';
}
menuPopupFixed.onmouseout = function (){
    menuPopupFixed.style.display = 'none';
}

//底部图标变换事件

let footerTwoLeftIcon1 = document.querySelector(".footerTwoLeftIcon1");
let footerTwoLeftIcon2 = document.querySelector(".footerTwoLeftIcon2");
let footerTwoLeftIcon3 = document.querySelector(".footerTwoLeftIcon3");
let footerTwoLeftIcon4 = document.querySelector(".footerTwoLeftIcon4");

let footerRightIcon1 = document.querySelector(".footerRightIcon1");
let footerRightIcon2 = document.querySelector(".footerRightIcon2");

let footerPopup1 = document.querySelector(".footerPopup1");
let footerPopup2 = document.querySelector(".footerPopup2");
let footerPopup3 = document.querySelector(".footerPopup3");

let footerPopup4 = document.querySelector(".footerPopup4");
let footerPopup5 = document.querySelector(".footerPopup5");

//跑马灯
//获取文本颜色    获取原色
function getColor(){
    var r = Math.floor(Math.random()*256);//随机红
    var g = Math.floor(Math.random()*256);//随机绿
    var b = Math.floor(Math.random()*256);//随机蓝
    return "rgb("+ r +"," + g + ","+ b + ")";
}
function randomTxt(text){
    text.style.color = getColor();
}

let cool;

function mouseoverFooterleft(x){
    if (x == 1){
        footerTwoLeftIcon1.className = 'footerTwoLeftIcon1off';
    }else if (x == 2){
        footerTwoLeftIcon2.className = 'footerTwoLeftIcon2off';
        footerPopup1.style.display = 'block';
        cool = setInterval('randomTxt(footerPopup1)',100);

    }else if (x == 3){
        footerTwoLeftIcon3.className = 'footerTwoLeftIcon3off';
        footerPopup2.style.display = 'block';
        cool = setInterval('randomTxt(footerPopup2)',100);
    }else if (x == 4){
        footerTwoLeftIcon4.className = 'footerTwoLeftIcon4off';
        footerPopup3.style.display = 'block';
        cool = setInterval('randomTxt(footerPopup3)',100);
    }
}
function mouseoutFooterleft(x){
    clearInterval(cool);
    if (x == 1){
        footerTwoLeftIcon1.className = 'footerTwoLeftIcon1';
    }else if (x == 2){
        footerTwoLeftIcon2.className = 'footerTwoLeftIcon2';
        footerPopup1.style.display = 'none';
    }else if (x == 3){
        footerTwoLeftIcon3.className = 'footerTwoLeftIcon3';
        footerPopup2.style.display = 'none';
    }else if (x == 4){
        footerTwoLeftIcon4.className = 'footerTwoLeftIcon4';
        footerPopup3.style.display = 'none';
    }
}
function mouseoverFooterRight(x){
    if (x == 5){
        footerRightIcon1.className = 'footerRightIcon1off'
        footerPopup4.style.display = 'block';
    }else if(x == 6){
        footerRightIcon2.className = 'footerRightIcon2off'
        footerPopup5.style.display = 'block';
    }
}
function mouseoutFooterRight(x){
    if (x == 5){
        footerRightIcon1.className = 'footerRightIcon1'
        footerPopup4.style.display = 'none';
    }else if(x == 6){
        footerRightIcon2.className = 'footerRightIcon2'
        footerPopup5.style.display = 'none';
    }
}

